﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="EditAssetType.aspx.cs" Inherits="HRProject.Asset.EditAssetType" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Edit an Asset category</title>
    <script type="text/javascript" language="javascript" src="/js/jquery-1.8.2.js"></script>
    <script type="text/javascript" language="javascript" src="/js/tree.js"></script>
    <script type="text/javascript" language="javascript" src="/js/asset.js"></script>
    <style type="text/css">
        .actionbar{
	        height:25px;
	        width:100px;
	        position:relative;
	        top:10px;
	        float:left;
	        visibility:hidden;
        }
        .item{
	        float:left;
	        width:25px;
	        height:25px;
        }
        .view
        {
	        background-image:url('/image/layout/ViewIcon.png');
        }
        .add
        {
	        background-image:url('/image/layout/AddIcon.png');
        }
        .edit
        {
	        background-image:url('/image/layout/EditIcon.png');
        }
        .remove
        {
	        background-image:url('/image/layout/RemoveIcon.png');
        }
        
        /* tooltip */
        div.tooltip 
        {
	        outline:none;
	        float:left;
        }
        div.tooltip strong
        {
	        line-height:30px;
	        color:Blue;
	        font-size:large;
        }
        div.tooltip:hover
        {
	        text-decoration:none;
        }
        div.tooltip .tooltip-content
        {
	        z-index:10;
	        display:none;
	        padding:14px 20px;
	        margin-top:-30px;
	        margin-left:48px;
	        line-height:16px;
	        float:left;
        }
        div.tooltip:hover .tooltip-content
        {
	        display:inline;
	        position:absolute;
	        color:#111;
	        border:1px solid #DCA;
	        background:#fffAF0;
        }
        div.tooltip img.assetIcon
        {
        	width:100px;
        	height:100px;
        }
        div.tooltip div textarea
        {
        	float:left;
        	border-width:0px;
        	background-color:Transparent;
        	font-weight:bold;
        	overflow:auto;
        	color:Blue;
        }
        div.tooltip .label
        {
        	clear:left;
        }
        div.tooltip .info
        {
        	font-weight:bold;
        	padding-left:10px;
        	color:Blue;
        }
        .callout
        {
	        z-index:20;
	        position:absolute;
	        top:10px;
	        border:0;
	        left:-12px;
        }
        /*CSS3 extras*/
        a.tooltip span
        {
	        border-radius:4px;
	        -moz-border-radius: 4px;
	        -webkit-border-radius: 4px;
	        -moz-box-shadow: 5px 5px 8px #CCC;
	        -webkit-box-shadow: 5px 5px 8px #CCC;
	        box-shadow: 5px 5px 8px #CCC;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <table>
            <tr>
                <td>Name</td>
                <td>
                    <asp:TextBox ID="tbxName" runat="server"></asp:TextBox>
                    <asp:HiddenField ID="hdfId" runat="server"/>
                </td>
            </tr>
            <tr>
                <td>Parent category</td>
                <td><asp:TextBox ID="tbxParent" runat="server" Enabled="false"></asp:TextBox></td>
            </tr>
            <tr>
                <td>Description</td>
                <td><asp:TextBox ID="txaDescription" runat="server" TextMode="MultiLine"></asp:TextBox></td>
            </tr>
            <tr>
                <td valign="top">
                    Assets
                    <input type="button" value="+" onclick="addAsset()" />
                </td>
                <td>
                <div id="assets" style="height:250px;overflow:scroll;border:solid 1px black;">
                <%
                    for (int i = 0; i < Assets.Count; i++)
                    {%>
                    <div style="float:left;clear:both;" onmouseover="treeNodeMove(this);"
                        onmouseout="treeNodeOut(this);">
                        <div style="text-decoration:none;" class="tooltip">
                            <div class="asset-name"><%= Assets[i].Name %></div>
                            <div class="tooltip-content">
                                <img alt="" class="callout" src="/image/layout/callout.gif" />
                                <strong><%= Assets[i].Name %></strong><br />
                                <img alt="" src="<%= Assets[i].ImageUrl %>" style="float:right;" name="assetIcon" class="assetIcon"/>
                                <div class="label">Product ID</div>
                                <div class="info divProductId"><%= Assets[i].ProductId %></div>
                                <div class="label">Import date</div>
                                <div class="info divImportDate"><%= Assets[i].ImportDate.ToString("dd/MM/yyyy") %></div>
                                <div class="label">Terminate date</div>
                                <div class="info divTerminateDate"><%= Assets[i].TerminateDate.ToString("dd/MM/yyyy") %></div>
                                <div class="label">Description</div>
                                <textarea class="info divDescription" readonly="readonly"><%= Assets[i].Description %></textarea>
                            </div>
                        </div>
                        <div class="actionbar" style="top:0px;">
                            <div class="item edit" onclick="editAsset(this);"></div>
                            <div class="item remove" onclick="removeAsset(this);"></div>
                            <input type="hidden" name="assetId" value="<%= Assets[i].Id %>"/>
                            <input type="hidden" name="assetName" value="<%= Assets[i].Name %>"/>
                            <input type="hidden" name="assetProductId" value="<%= Assets[i].ProductId %>"/>
                            <input type="hidden" name="assetDescription" value="<%= Assets[i].Description %>"/>
                            <input type="hidden" name="assetImportDate" value="<%= Assets[i].ImportDate.ToString("dd/MM/yyyy") %>"/>
                            <input type="hidden" name="assetTerminateDate" value="<%= Assets[i].TerminateDate.ToString("dd/MM/yyyy") %>"/>
                            <input type="hidden" name="assetImageUrl" value="<%= Assets[i].ImageUrl %>"/>
                        </div>
                    </div>
                    <%}
                %>
                    <div style="float:left;clear:both;display:none" onmouseover="treeNodeMove(this);"
                        onmouseout="treeNodeOut(this);" id="sampleAsset">
                        <div style="text-decoration:none;" class="tooltip">
                            <div class="asset-name"></div>
                            <div class="tooltip-content">
                                <img alt="" class="callout" src="/image/layout/callout.gif" />
                                <strong></strong><br />
                                <img alt="" src="" style="float:right;" name="assetIcon" class="assetIcon"/>
                                <div class="label">Product ID</div>
                                <div class="info divProductId"></div>
                                <div class="label">Import date</div>
                                <div class="info divImportDate"></div>
                                <div class="label">Terminate date</div>
                                <div class="info divTerminateDate"></div>
                                <div class="label">Description</div>
                                <textarea class="info divDescription" readonly="readonly"></textarea>
                            </div>
                        </div>
                        <div class="actionbar" style="top:0px;">
                            <div class="item edit" onclick="editAsset(this);"></div>
                            <div class="item remove" onclick="removeAsset(this);"></div>
                            <input type="hidden" name="assetId" disabled="disabled"/>
                            <input type="hidden" name="assetName" disabled="disabled"/>
                            <input type="hidden" name="assetProductId" disabled="disabled"/>
                            <input type="hidden" name="assetDescription" disabled="disabled"/>
                            <input type="hidden" name="assetImportDate" disabled="disabled"/>
                            <input type="hidden" name="assetTerminateDate" disabled="disabled"/>
                            <input type="hidden" name="assetImageUrl" disabled="disabled"/>
                        </div>
                    </div>
                    <div style="visibility:hidden" id="divRemovedAssets">
                    </div>
                </div>
                </td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <asp:Button ID="btnOK" runat="server" Text="Update" onclick="btnOK_Click"/>
                    <input type="button" name="btnCancel" value="Cancel"
                        onclick="document.body.style.display='none';"/>
                </td>
            </tr>
            <tr>
                <td></td>
                <td><asp:Label ID="lblError" runat="server" Text="" ForeColor="Red"></asp:Label></td>
            </tr>
        </table>
    </form>
</body>
</html>
